<template lang="pug">
ModuleWrapper(title="绿色食品牌")
  .wrapper
    HorizontalBisection(styleName="between" v-for="(group, groupIndex) in finalStaticData" :key="groupIndex")
      StaticCompareView.static-item(v-for="(item, index) in group"
        :itemData="item" :key="index" valueColor="#05FDBB")
    HorizontalBisection(styleName="between")
      StaticCompareView.static-item(
        :itemData="greenFood" valueColor="#05FDBB")
      .companies
        .company 锐泽农业  畜禽-禽蛋
        .company 树美果蔬  果品-水果
</template>

<script>
import _ from 'lodash';
export default {
  name: "ModulePopulation",
  data() {
    return {
      staticData: [
        {
          label: '绿色食品（个）',
          value: 7,
        },
        {
          label: '无公害农产品（个）',
          value: 10,
        },
        {
          label: '认证有机食品（个）',
          value: 2,
        },
        {
          label: '地理标识（个）',
          value: 2,
        },
      ],
      greenFood: {
        label: '绿色食品目录（个）',
        value: 2,
      }
    }
  },
  computed: {
    finalStaticData() {
      return _.chunk(this.staticData, 2);
    }
  }
}
</script>

<style lang="scss" scoped>
.module{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  .wrapper{
    padding: 0 rem(10);
    .static-item{
      flex: 1;
    }
  }
}
.companies{
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex: 1;
  .company{
    @include fontSie(18);
    margin-bottom: rem(10);
    color: #05fdbb;
  }
}
</style>
